<template>
  <div>
    <iframe src="https://datav.aliyuncs.com/share/9e75b6f0eaeb97ae30bdae28910b84e8" id="mobsf" scrolling="yes" frameborder="0" style="width:100%;height: 620px;"></iframe>
  </div>
</template>

<script>
  import {STable} from '@/components'

  /**
   * 组件
   */
  const components = {STable}

  const columns = [

  ]

  const statusMap = {
    false: {
      status: '#108ee9',
      text: '启用'
    },
    true: {
      status: '#f50',
      text: '禁用'
    }
  }

  /**
   * 数据
   */
  const data = function() {
    return {
      // 高级搜索 展开/关闭
      advanced: false,
      // 查询参数
      queryParam: {},
      columns,
      editProps: [],
      loading: false,

      // 加载数据方法 必须为 Promise 对象
      loadData: parameter => {
        return selectPage(Object.assign(parameter, this.queryParam)).then(res => {
          return res.data
        })
      }
    }
  }

  const created = function () {

  }

  /**
   * 过滤器
   */
  const filters = {
    statusFilter (status) {
      return statusMap[status].text
    },
    statusColorFilter (status) {
      return statusMap[status].status
    },
  }

  /**
   * 计算属性
   */
  const computed = {}

  /**
   * 侦听器
   */
  const watch = {}

  export default {
    data: data,
    components: components,
    created: created,
    filters: filters,
    computed: computed,
    watch: watch,
    /**
     * 方法
     */
    methods: {
      handleAdd() {
        this.$refs.createModal.add()
      },
      handleEdit(record) {
        this.$refs.createModal.edit(record)
      },
      handleTrade(record) {
        this.$router.push({ path: '/trade/tradeList', query: {memberId: record.id} })
      },
      handleOrder(record) {
        this.$router.push({ path: '/member/productList', query: {memberId: record.id} })
      },
      refresh(){
        this.$refs.table.refresh()
      },
      handleDel (record) {
        const _this = this
        this.$confirm({
          title: '警告',
          content: `真的要删除 ${record.name} 吗?`,
          okText: '删除',
          okType: 'danger',
          cancelText: '取消',
          onOk () {
            // 在这里调用删除接口
            del(record.id).then(res => {
              if (res.code === 200) {
                _this.$message.success(res.message)
                _this.$refs.table.refresh()
              }
              if (res.code === 500) {
                _this.$message.error(res.message)
              }
            })
          }
        })
      },
      filterOption (input, option) {
        return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
      },
      changeAdmin(id) {
        const that = this
        that.loading = true
        changeAdmin(id).then(res => {
          that.loading = false
          if (res.code === 200) {
            that.$refs.table.refresh()
          }
        })
      },
      exportExcell() {
        this.loading = true
        exportExcel(this.queryParam).then(res => {
          this.loading = false
          const link = document.createElement('a')
          let blob = new Blob([res], {type: 'application/vnd.ms-excel'});
          link.style.display = 'none'
          link.href = URL.createObjectURL(blob);
          let num = ''
          for (let i = 0; i < 10; i++) {
            num += Math.ceil(Math.random() * 10)
          }
          link.setAttribute('download', '会员列表.xlsx')
          document.body.appendChild(link)
          link.click()
          document.body.removeChild(link)
        })
      }
    }
  }
</script>

<style scoped>

</style>
